<template>
    <div class="right-main">
        <div class="naver">
            <naver />
        </div>
        <div class="main">
            <!-- 右下角主体部分 -->
            <div v-if="this.$store.state.listpage">
                <div v-if="this.$store.state.details">
                    <div v-if="this.$store.state.flag">
                        <keep-alive>
                            <component :is="checkout[$store.state.tabid].component"></component>
                        </keep-alive>
                    </div>
                    <div v-else>
                        <AddNews></AddNews>
                    </div>
                </div>
                <div v-else>
                    <Details></Details>
                </div>
            </div>
            <div v-else>
                <AddList></AddList>
            </div>
        </div>
    </div>
</template>
<script>
import Vue from 'vue'
// 网站配置
import PaGe from '../right/网站配置/PaGe.vue'

// 首页组件
// baner管理
import BanNer from '../right/首页/BanNer.vue';
// 虚拟仿真
import SimulAtion from '../right/首页/SimulAtion.vue';
// 解决方案
import ProgramMe from '../right/首页/ProgramMe.vue';
// 公司优势
import AdvanTage from '../right/首页/AdvanTage.vue'
//参与行业
import InduStry from '../right/首页/InduStry.vue';

// 产品与服务
// 类目管理
import TyPe from '../right/产品与服务/TyPe.vue';
// 详情页管理
import ParticuLars from '../right/产品与服务/ParticuLars.vue'
// 列表管理
import LiSt from '../right/产品与服务/LiSt.vue'
// 新闻管理
import NewsCenter from '../right/新闻管理/NewsCenter.vue'
// 留言查看
import CallWe from '../right/留言查看/CallWe.vue'
// 修改密码
import ChangePass from "../right/修改密码/ChangePass";

import naver from '../naver/NaverIndex.vue'

// 添加新闻
import AddNews from '@/components/AddNews.vue';

// 添加详情
import Details from "@/components/DetaiLs.vue";

// 添加列表
import AddList from "@/components/AddList.vue";
export default {
    components: {
        naver,
        PaGe,
        BanNer,
        SimulAtion,
        ProgramMe,
        AdvanTage,
        InduStry,
        TyPe,
        ParticuLars,
        LiSt,
        NewsCenter,
        CallWe,
        ChangePass,
        AddNews,
        Details,
        AddList
    },
    data() {
        return {
            checkout: [
                {
                    component: Vue.observable(PaGe)
                },
                {
                    component: Vue.observable(BanNer)
                },
                {
                    component: Vue.observable(SimulAtion)
                },
                {
                    component: Vue.observable(ProgramMe)
                },
                {
                    component: Vue.observable(AdvanTage)
                },
                {
                    component: Vue.observable(InduStry)
                },
                {
                    component: Vue.observable(TyPe)
                },
                {
                    component: Vue.observable(ParticuLars)
                },
                {
                    component: Vue.observable(LiSt)
                },
                {
                    component: Vue.observable(NewsCenter)
                },
                {
                    component: Vue.observable(CallWe)
                },
                {
                    component: Vue.observable(ChangePass)
                }
            ]
        }
    },
}
</script>
<style scoped lang="less">
.naver {
    width: 100%;
    height: 50px;
    background-color: #fff;
    position: sticky;
    top: 0px;
    border-radius: 5px;
    z-index: 2;
    min-width: 700px;
}

.right-main {
    height: 100%;
}

.main {
    // margin-top: 20px;
    // padding: 5px;
    // height: 9999px;
    min-width: 700px;
}
</style>